/* 
额外的问题
1 手动删除 input标签 h5属性 required（存在兼容性问题，不用它） 
2 form标签和button在一起 点击button会刷新    给button按钮 type="button"


1 给登录按钮 绑定点击事件
2 获取到用户名和密码
3 简单校验一下 用户名和密码 不能为空 
  1 弹出窗口 不再使用原生js的  使用 layui的 好看 
4 阅读接口文档， 查看一下登录接口 。。。来完成登录
5 登录成功 
  1 把token 存储到本地存储
  2 跳转到 首页 index.html

6 打开首页 index.html
  1 都需要判断一下 本地存储中有没有token 
    1 如果发现 没有token 重新跳转回登录页面 
      
 */
$(function () {
  // click 被划掉 vscode的jq的语法提示的插件的小问题
  $("#login").on("click", function () {
    // console.log("🦊很容易摔倒  脚滑 ");

    // 2 获取用户名和密码
    const username = $("#username").val().trim();
    const password = $("#password").val().trim();

    // 3 合法性验证 
    if (!username || !password) {
      // 两个随便一个 为空字符串 
      // alert("用户名或者密码不能为空");
      // 使用layui的弹出窗口了
      layer.alert('用户名或者密码不能为空');
      return
    }


    // 4 提交参数 进行登录
    $.post("http://localhost:8080/api/v1/admin/user/login", { username, password }, function (res) {
      // console.log(res);

      if (res.code !== 200) {
        // layer.msg 显示一会之后会自动消失
        layer.msg(res.msg);
        // 表示 登录失败
        return
      }

      // 登录成功  使用本地存储 将token 存起来
      localStorage.setItem("token", res.token);
      // 跳转到 首页 index.html
      location.href = "index.html";


    })

  })

})